<template>
  <el-form :model="searchData" ref="searchRef">
    <el-form-item prop="keyword" :label="label" label-width="80px">
      <el-input
        v-model="searchData.keyword"
        :placeholder="placeholder"
      ></el-input
    ></el-form-item>
    <el-form-item prop="state" label="状态" label-width="80px">
      <el-select v-model="searchData.state" placeholder="请选择">
        <el-option
          v-for="item in status"
          :key="item.value"
          :label="item.label"
          :value="item.value"
        >
        </el-option
      ></el-select>
      <el-button @click="resetField">清空</el-button>
      <el-button type="primary" class="search" @click="search">搜索</el-button>
    </el-form-item>
    <el-button
      type="text"
      v-if="$route.query.id"
      @click="gogo"
      style="position: absolute; right: 160px"
    >
      <i class="el-icon-back">返回学科 </i>
    </el-button>
    <el-button type="success" size="small" class="editBtn">
      <i class="el-icon-edit" @click="$emit('add')">{{ newwhat }}</i></el-button
    >
  </el-form>
</template>

<script>
export default {
  props: {
    searchData: {
      type: Object,
      required: true
    },
    status: {
      type: Array,
      required: true
    },
    label: {
      type: String,
      required: true
    },
    newwhat: {
      type: String,
      required: true
    },
    placeholder: {
      type: String,
      required: true
    }
  },
  data() {
    return {}
  },
  created() {},
  methods: {
    resetField() {
      this.$refs.searchRef.resetFields()
    },
    async search() {
      await this.$emit('search')
      this.resetField()
    }
  }
}
</script>

<style scoped lang="scss">
.el-form .el-form-item {
  margin-bottom: 18px;
  display: inline-block;
  .el-input {
    width: 200px;
    position: relative;
    height: 32px;
    line-height: 32px;
  }
  .el-button {
    margin-left: 15px;
    padding: 9px 15px;
    border-radius: 3px;
  }
  .search {
    margin-left: 10px;
  }
}
.editBtn {
  margin-left: 355px;
  padding: 9px 15px;
  border-radius: 3px;
}
</style>
